'use client'

import React from 'react'
import { Upload, Download, FileSpreadsheet, FileText } from 'lucide-react'
import { useUniver } from '@/components/univer/UniverProvider'

interface UniverPluginToolbarProps {
  className?: string
}

export const UniverPluginToolbar: React.FC<UniverPluginToolbarProps> = ({
  className = ''
}) => {
  const { univerAPI, isReady } = useUniver()

  // 触发CSV导入命令
  const handleImportCSV = () => {
    if (!isReady || !univerAPI) {
      alert('Univer 未就绪，请稍后再试')
      return
    }

    try {
      // 使用Univer的命令系统触发CSV导入
      univerAPI.executeCommand('import-csv-button')
    } catch (error) {
      console.error('CSV导入失败:', error)
      alert('CSV导入失败: ' + (error instanceof Error ? error.message : String(error)))
    }
  }

  // 触发Excel导入命令
  const handleImportExcel = () => {
    if (!isReady || !univerAPI) {
      alert('Univer 未就绪，请稍后再试')
      return
    }

    try {
      // 使用Univer的命令系统触发Excel导入
      univerAPI.executeCommand('import-excel-button')
    } catch (error) {
      console.error('Excel导入失败:', error)
      alert('Excel导入失败: ' + (error instanceof Error ? error.message : String(error)))
    }
  }

  // 触发CSV导出命令
  const handleExportCSV = () => {
    if (!isReady || !univerAPI) {
      alert('Univer 未就绪，请稍后再试')
      return
    }

    try {
      // 使用Univer的命令系统触发CSV导出
      univerAPI.executeCommand('export-csv-button')
    } catch (error) {
      console.error('CSV导出失败:', error)
      alert('CSV导出失败: ' + (error instanceof Error ? error.message : String(error)))
    }
  }

  // 触发Excel导出命令
  const handleExportExcel = () => {
    if (!isReady || !univerAPI) {
      alert('Univer 未就绪，请稍后再试')
      return
    }

    try {
      // 使用Univer的命令系统触发Excel导出
      univerAPI.executeCommand('export-excel-button')
    } catch (error) {
      console.error('Excel导出失败:', error)
      alert('Excel导出失败: ' + (error instanceof Error ? error.message : String(error)))
    }
  }

  return (
    <div className={`flex items-center gap-2 ${className}`}>
      {/* CSV导入按钮 */}
      <button
        onClick={handleImportCSV}
        className="flex items-center gap-1 px-3 py-1.5 text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-lg transition-colors"
        title="导入CSV文件"
        disabled={!isReady}
      >
        <Upload className="w-4 h-4" />
        <span>导入CSV</span>
      </button>

      {/* Excel导入按钮 */}
      <button
        onClick={handleImportExcel}
        className="flex items-center gap-1 px-3 py-1.5 text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-lg transition-colors"
        title="导入Excel文件"
        disabled={!isReady}
      >
        <FileSpreadsheet className="w-4 h-4" />
        <span>导入Excel</span>
      </button>

      {/* CSV导出按钮 */}
      <button
        onClick={handleExportCSV}
        className="flex items-center gap-1 px-3 py-1.5 text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-lg transition-colors"
        title="导出为CSV"
        disabled={!isReady}
      >
        <FileText className="w-4 h-4" />
        <span>导出CSV</span>
      </button>

      {/* Excel导出按钮 */}
      <button
        onClick={handleExportExcel}
        className="flex items-center gap-1 px-3 py-1.5 text-sm text-gray-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-gray-100 hover:bg-gray-100 dark:hover:bg-gray-800 rounded-lg transition-colors"
        title="导出为Excel"
        disabled={!isReady}
      >
        <Download className="w-4 h-4" />
        <span>导出Excel</span>
      </button>
    </div>
  )
}
